<!DOCTYPE html>
<html lang="zh-CN">
    <head>
        <meta charset="UTF-8">
        <title>{{ info['title'] }} - FNK</title>
        <link rel="stylesheet" href="/static/css/navbar.css">
        <link rel="stylesheet" href="/static/css/page.css">
        <link rel="stylesheet" href="/static/css/md.css">
        <link rel="stylesheet" href="/static/css/katex.min.css">
        <script src="/static/js/marked.min.js"></script>
        <script src ="/static/js/katex.min.js"></script>
        <style>
            .btn-link {
                padding: 5px 10px 0 0;
                color: #95a5a6;
                float: right!important;
                font-family: "Helvetica Neue",Helvetica,Arial,sans-serif;
            }
            .glyphicon {
                position: relative;
                top: 1px;
                display: inline-block;
                font-family: 'Glyphicons Halflings';
                font-style: normal;
                font-weight: 400;
                font-size: 20px;
                text-align: center;
                white-space: nowrap;
                line-height: 1;
                -webkit-font-smoothing: antialiased;
                -moz-osx-font-smoothing: grayscale;
            }
            .glyphicon-trash:before {
                content: "\e020";
            }
            .glyphicon-pencil:before {
                content: "\270f";
            }
        </style>
    </head>
    <body>
        <nav class="navbar">
            <div class="logo">FNK</div>
            <ul class="nav-links">
                <li><a href="/home">首页</a></li>
                <li><a href="/file">文件</a></li>
                <li><a href="/note">笔记</a></li>
                <li><a href="/resource">资源</a></li>
                <li><a href="/about">关于</a></li>
            </ul>
            <div class="users">
            {% if user %}
                <p>{{ user }}</p>
                <button class="user-btn" onclick="javascript:location.href='/logout'">登出</button>
            {% else %}
                <button class="user-btn" onclick="javascript:location.href='/login'">登录</button>
            {% endif %}
            </div>
        </nav>
        <div class="page-box">
            <h1 style="text-align: left; color: #31708f; padding-bottom: 0px;">{{ info['title'] }}</h1>
            <div style="color: #999999; font-size:14px; padding-bottom: 10px;">
                作者：<a href="#">{{ info['Author'] }}</a> ，时间：{{ info['CreateTime'] }}
                <a onclick="return confirm('确认删除此笔记？')" href="/note/delete/{{ info['Author'] }}/{{ info['title'] }}" class="btn-link">
                    <span class="glyphicon glyphicon-trash" aria-hidden="true"></span>
                </a>
                <a href="/note/update/{{ info['Author'] }}/{{ info['title'] }}" class="btn-link">
                    <span class="glyphicon glyphicon-pencil" aria-hidden="true"></span>
                </a>
            </div>
            <hr>
            <div class="markdown-body" id="content-markdown" style="padding-top: 10px;">
                <input type="hidden" id="content-input" value="{{ content }}">
            </div>
        </div>
        <script>
            var content_markdown = document.getElementById("content-input").value
            var content_html = marked(content_markdown)
            document.getElementById("content-markdown").innerHTML = content_html
            var katex_exp = document.getElementsByClassName("math")
            for(var i=0;i<katex_exp.length;i++) {
                katex.render(katex_exp.item(i).innerHTML, katex_exp.item(i));
            }
        </script>
    </body>
</html>